<template>
    <div class='finance_content' v-if="financeVisi.visibled">
        <div><span>账户余额</span></div>
        <div>
        		<span>{{current_user.amount | conver_money}}</span>
	        	<div v-if="current_user.role!=2 && current_user.user_type=='finance'" style="display:-webkit-box;display:-webkit-flex;display:flex;width: 50%;margin-left:25%">
	        		<span @click="recharge('充值')" class="finance_word">充值</span>
	        		<span @click="recharge('提现')" class="finance_word">提现</span>
	        </div>
        </div>   
    </div>
</template>
<script >
import Vue from 'vue'

import { mapActions, mapState, mapGetters } from 'vuex'
export default {
    data() {
        return {    
        		name:"充值"
        }
    },
    computed:{
        ...mapGetters(['pay' , 'financeVisi', 'current_user'])
    },
    mounted() {
//  		console.log(this.$current_user)
    },
    methods:{
        recharge(type){
       	 	this.$router.push({name:'recharge',params:{ id: type}})
        }
    }
}
</script>
<style lang='scss'>
 .finance_content{
    min-width: 25%;
    height: 330px;
    padding:30px;
    background: #fff;
    text-align: center;
    border: 1px solid #e0e6ed;
    span{
        font-size:14px;
        color:#5e6d82;
    }
    > div:nth-child(2){
        margin-top:50px;
        background:#f9fafc;
        width:100%;
        height:240px;
        span{
            display: block;
        }
        > span:first-child{
            padding-top:73px;
            font-size:30px;
            color:#31b69b;
        }
    }
    .finance_word{
    		font-size:13px;
		color:#20a0ff;
		width: 50%;
		text-align: center;
		margin-top: 40%;
    }
}
</style>
